<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name='format-detection' content='telephone=no' />
<title>人车人</title><link rel="icon" href="/assets/img/titleico.ico" type="image/x-icon">
<link rel="stylesheet" href="/assets/css/common.css" />
<link rel="stylesheet" href="/assets/css/iconfont/iconfont.css" />
<style>
body {
	background-color: #fff;
}

section {
	background-color: #fff;
	padding-bottom: 6rem;
}

section .container .title {
	padding: .4rem 2rem;
	background-color: #eaeaea;
}

section .container .list li {
	padding: 0 5%;
	font-size: 1.4rem;
}

section .container .list li .tit {
	height: 5.8rem;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
}

section .container .list li .tit .fut {
	font-size: 1.2rem;
}

section .container .list li .tit .wd {
	width: 10rem;
}

section .container .list li .hide {
	height: 0;
	overflow: hidden;
}

section .container .list li .hide .msg {
	padding: 1rem 0;
}

section .container .list li .hide .msg p {
	display: inline-block;
}

section .container .list li .hide .msg span {
	width: 85%;
	color: #888;
}

section .container .list li i.iconfont {
	font-size: 2rem;
}

section .container .list li .tit i.rotate {
	transform: rotate(90deg);
}

section .container .out {
	display: block;
	margin: 1rem auto;
	width: 90%;
	height: 2.8 rem;
	line-height: 2.8rem;
	text-align: center;
	background-color: #fff;
	border-radius: 99px;
	border: 1px solid #007aff;
	color: #007aff;
}
</style>
<script src="/assets/js/jquery-3.1.1.min.js"></script>
</head>
<body>
	<!-- header start -->
	#@tabHead("业绩",true)
	<!-- end header -->
	<div id="show-template" class="show-template trans">
		<div class="loading"></div>
		<img src="" />
	</div>
	#@loadContainer()
	<section id="app" class="visiblecon sectrans">
		<div class="container">
			<ul class="list" id="ulcon"></ul>
		</div>
	</section>

	<!-- footer start -->
	#--#@footer(2)--#
	<!-- end footer -->

	<script src="/assets/js/fastclick.min.js"></script>
	<script src="/assets/js/xxsg.js"></script>
	<script>
	    $(function(){
    		var progress = #(user.progress);
    		if(progress != 4)return;
    		if(userprogress == 3){
				$("section").append("<a href='/userCenter/perfectMsg' class='perfectmsg' style='margin-top: 55%;background-color:#F0AD4E'>有反馈信息</a>");
				return;
			}
			$.ajax({
	            "type":"post",
	            "url": "/userCenter/getPersonDataInfo",
	            "success":function(data){  
	            	console.log(data)
	            	getBaseTab(data,showSuc);
	            }
	        })
	        
	        var ulDom = $("#ulcon");
	        
	        function getBaseTab(data,callback){
	        	var html = "<li class='b_bor' isshow='false'>"+
	        			   "	<div class='flexbox tit'>"+
		        		   "		<p class='name'>车抵贷</p>"+
		        		   "		<p class='fut'>业绩量："+ data.more.total +"</p>"+
		        		   "		<p class='fut wd'>成交率："+ (data.more.successRate) / 100 +"%</p>"+
	        			   "		<i class='iconfont trans'>&#xe61d;</i>"+
	        			   "	</div>"+
	        			   "	<div class='hide trans'>"+
	        			   "		<div class='msg b_bor'><p>总订单量：</p><span>"+ data.more.total +"</span></div>"+
	        			   "		<div class='msg b_bor'><p>成交订单量：</p><span>"+ data.more.success +"</span></div>"+
	        			   "		<div class='msg b_bor'><p>逾期订单量：</p><span>"+ data.more.overdue +"</span></div>"+
	        			   "		<div class='msg b_bor'><p>总业绩：</p><span>"+ data.more.totalAmount +"</span></div>"+
	        			   "		<div class='msg b_bor'><p>当月业绩：</p><span>"+ data.more.monthAmount +"</span></div>"+
	        			   "		<div class='msg b_bor'><p>成交率：</p><span>"+ (data.more.successRate) / 100 +"%</span></div>"+
	        			   "		<div class='msg'><p>逾期率：</p><span>"+ data.more.overdueRate +"%</span></div>"+
	        			   "	</div>"+
	        		       "</li>";
				ulDom.append(html);
				callback();
			}
	        
	        function showSuc(){
    			$("#app").removeClass("visiblecon");
    			$("#load-container").removeClass("load7");
        	}
	        
	        ulDom.on("click","li.b_bor",function(){
	        	var that = $(this),
	        		isshow = that.attr("isshow"),
	        		hideDom = that.children(".hide");
	        	if(isshow == "false"){
	                that.attr("isshow",true);
	                that.children(".tit").children("i").addClass("rotate");
	                var h = hideDom[0].scrollHeight;
	               	hideDom.css("height",h);
	            }else{
	                that.attr("isshow",false);
	                that.children(".tit").children("i").removeClass("rotate");
	                hideDom.css("height",0);
	            }
	        })
	        
		});
    </script>
</body>
</html>